{% extends "base.html" %}

{% block title %}关于我 - 我的个人网站{% endblock %}

{% block content %}
<div class="about-container">
    <h1>关于我</h1>
    <div class="about-content">
        <div class="about-text">
            <p>👋 你好！我是一名充满激情的全栈开发者和数据科学家，拥有 5 年的行业经验。我热衷于使用技术解决现实世界的问题，并不断学习新的技能和工具。</p>

            <h2><i class="fas fa-cogs"></i> 技术技能</h2>
            <ul>
                <li><strong>前端</strong>: React, Vue.js, HTML5, CSS3, JavaScript/TypeScript</li>
                <li><strong>后端</strong>: Python (Django, Flask, FastAPI), Node.js, RESTful API</li>
                <li><strong>数据科学</strong>: Pandas, NumPy, Matplotlib, Scikit-learn, TensorFlow</li>
                <li><strong>数据库</strong>: PostgreSQL, MySQL, MongoDB, Redis</li>
                <li><strong>DevOps</strong>: Docker, AWS, Git, CI/CD, Linux</li>
            </ul>

            <h2><i class="fas fa-graduation-cap"></i> 教育背景</h2>
            <p>计算机科学硕士 | 某知名大学 | 2016-2019</p>

            <h2><i class="fas fa-briefcase"></i> 工作经历</h2>
            <p>高级软件工程师 | 某科技公司 | 2019-至今</p>
        </div>
        <div class="about-image">
            <img src="/static/images/profile.jpg" alt="个人照片" onerror="this.src='https://via.placeholder.com/300x300/3498db/ffffff?text=Profile+Image'">
            <div style="margin-top: 1rem;">
                <a href="#" style="margin: 0 0.5rem; color: #333;"><i class="fab fa-github fa-2x"></i></a>
                <a href="#" style="margin: 0 0.5rem; color: #0077b5;"><i class="fab fa-linkedin fa-2x"></i></a>
                <a href="#" style="margin: 0 0.5rem; color: #1da1f2;"><i class="fab fa-twitter fa-2x"></i></a>
            </div>
        </div>
    </div>
</div>
{% endblock %}